
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/common/includes.jsp"%>

<!DOCTYPE html>
<html lang="${currentLocale}">
<head>
<title>悠儿</title>
<%@ include file="/WEB-INF/common/meta.jsp"%>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<%@ include file="/WEB-INF/common/global_res.jsp"%>
<link type="text/css" rel="stylesheet" href="${ctx}/res/lib/masonry/style.css" />

</head>
<body>
	<%@ include file="/WEB-INF/common/header.jsp" %>

	<div class="container" id="topicList">
		<div class="row">
			<div class="span9">
				<div class="row-fluid">
					<div class="span12">
						<a href="${ctx}/pictext/${picTextId}/seq">排序</a>
					</div>
				</div>
				<div id="picItems" class="row-fluid">
					<div class="span12">
						<c:forEach var="picItemView" items="${picItemViewList}" varStatus="status">
						<div class="box photo col2">
							<c:url var="imgUrl" value="/img/picitem/n/${picItemView.id}.jpg" />
							<a href="/picitem/${picItemView.id}"><img src="${imgUrl}" /></a>
							<p>
								<a href="/picitem/${picItemView.id}">${picItemView.textS}</a>
							</p>
						</div>
						</c:forEach>
						<section id="pageBar">
							${pageBar}	
						</section>
					</div>
				</div>
			</div>
			
			<div class="span3 rightbox">
				<div class="row-fluid">
					<div class="span12">
					</div>
				</div>
			</div>
			
		</div>

	</div>

	<%@ include file="/WEB-INF/common/footer.jsp"%>

</body>
<script src="${ctx}/res/lib/masonry/jquery.masonry.min.js"></script>
<script>
	$(function(){
	    var $container = $('#picItems');
	    $container.imagesLoaded( function(){
	      $container.masonry({
	        itemSelector : '.box'
	      });
	    });
	  });
</script>
</html>